<template>
	<view>
		<image src="./1.jpg" mode="" class="top"></image>
		<view class="detail">
			<view class="left">
				<view class="price">
					￥299.00
				</view>
				<view class="count">
					6次卡【限量发售】
				</view>
			</view>
			<view class="totol">
				已售：1584
			</view>
		</view>
		<image src="./2.jpg" mode="" class="big_img"></image>
		<view class="btn">
			<view class="left">
				<view class="tip">
					实付金额
				</view>
				<view class="price">
					￥{{total_fee}}
				</view>
			</view>
			<view class="submit" @click="gotoPay">
				立即付款
			</view>
		</view>
	</view>
</template>

<script>
	import {
		request
	} from '@/utils/request.js';
	export default {
		data() {
			return {
				total_fee: 320
			};
		},
		methods: {
			gotoPay() {
				uni.navigateTo({
					url: "/pagesA/payDetail/payDetail"
				})


			}
		}
	}
</script>

<style lang="scss">
	.top {
		width: 750rpx;
		// height: 464rpx;
	}

	.detail {
		display: flex;
		justify-content: space-between;
		width: 710rpx;
		margin: auto;
		padding-bottom: 40rpx;
		border-bottom: 1rpx solid #745A94;

		.left {
			display: flex;
			flex-direction: column;

			.price {
				font-family: Source Han Sans SC;
				font-weight: 500;
				font-size: 36rpx;
				color: #333333;
				margin-bottom: 34rpx;
			}

			.count {
				font-family: Source Han Sans SC;
				font-weight: 500;
				font-size: 30rpx;
				color: #333333;
				line-height: 36rpx;
			}
		}

		.totol {
			font-family: Source Han Sans SC;
			font-weight: 500;
			font-size: 24rpx;
			color: #333333;
			line-height: 36rpx;
		}
	}

	.big_img {
		width: 710rpx;
		height: 7170rpx;
		margin-top: 20rpx;
		margin-left: 20rpx;
	}

	.btn {
		position: fixed;
		bottom: 0;
		width: 750rpx;
		height: 98rpx;
		background: #FFFFFF;
		display: flex;
		justify-content: space-between;
		padding: 20rpx 20rpx 46rpx;

		.left {
			display: flex;
			line-height: 100rpx;

			.tip {
				font-family: Source Han Sans SC;
				font-weight: 500;
				font-size: 36rpx;
				color: #333333;
				line-height: 100rpx;
			}

			.price {
				font-family: Source Han Sans SC;
				font-weight: 500;
				font-size: 36rpx;
				color: #D72816;
				margin-left: 10rpx;
			}
		}

		.submit {
			background: #5A2F83;
			border-radius: 40rpx;
			font-family: Source Han Sans SC;
			font-weight: 500;
			font-size: 36rpx;
			color: #FFFFFF;
			text-align: center;
			padding: 23rpx 55rpx;
			margin-right: 20rpx;
		}
	}
</style>